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Abstract 

E-learning  software  is  a  product  of  information  and  communication  technology  used  to  help 
dynamic  and  flexible  learning  process  between  teacher  and  student.  The  software  technology  was  first 
used  in  the  development  of  e-learning  software  in  the  form  of  web  applications.  The  advantages  of  this 
technology  because  of  the  ease  in  the  development,  installation,  and  distribution  of  data.  Along  with 
advances  in  mobile/wireless  electronics  technology,  e-learning  software  is  adapted  to  this  technology 
known  as  mobile  learning.  The  ability  of  this  electronic  device  is  the  same  as  a  single  computer  even 
though  it  is  simpler  than  a  single  computer.  The  problem  that  arises  when  e-learning  software  operates  on 
multiple  platforms  is  that  computer  programs  are  made  repeatedly  depending  on  the  platform  being  used. 
This  situation  will  obviously  affect  the  quality  of  e-learning  software.  To  overcome  these  problems,  in  this 
study  developed  component-based  software  that  is  a  modern  paradigm  for  software  development  that 
produces  reusable  software  components,  high  quality,  and  cost-effective.  In  software  development, 
software  components  will  be  assembled  in  the  software  in  need.  The  result  of  this  research  is  high  quality 
e-learning  software  based  multiplatform  component. 
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1.  Introduction 

One  of  the  information  and  communication  technoiogy  products  used  for  teaching  and 
iearning  process  is  e-iearning.  Impiementation  of  e-iearning  in  an  educationai  institution 
invoiving  internet  technoiogy  media,  tv  cabie,  sateiiite  software,  muitimedia,  audio,  and  video 
[1].  According  to  [2]  there  are  four  forms  of  e-iearning  activity:  Individuaiized  seif-paced  e- 
iearning  oniine,  Individuaiized  seif-paced  e-iearning  offiine.  Group-based  e-iearning 
synchronousiy.  Group-based  e-iearning  asynchronousiy.  Utiiization  of  web  appiications  as  a 
iearning  media  in  e-iearning  system  increasingiy  iarge,  aiong  with  the  rapid  deveiopment  of  web 
technoiogy.  Initiaiiy  the  web  apps  were  static  iess  desirabie  in  the  use  of  e-iearning  system,  but 
after  deveioped  deveioped  web  2.0  technoiogy  then  the  use  of  web  appiications  on  e-iearning 
system  more  rapidiy  [3].  The  concept  of  content  in  web  appiications  of  e-iearning  systems  is 
known  as  Content  Management  System  (CMS)  [4].  With  the  CMS,  the  user  of  the  web 
appiication  oniy  to  customize  the  contents  of  the  appiication  in  accordance  with  the  needs. 
Since  the  deveiopment  of  wireiess  internet  the  use  of  mobiie/wireiess  eiectronics  devices  is  no 
ionger  iimited  to  communication  toois  but  used  for  internet  needs  [5]. 

The  fiexibiiity  of  e-iearning  software  that  is  abie  to  operate  in  many  eiectronic  devices 
(muiti-piatform)  requires  some  form  of  software  architecture  that  can  simpiify  software  deveioper 
e-iearning.  Deveiopment  software  component-base  is  a  form  of  modern  software  deveiopment 
that  is  abie  to  produce  a  software  that  is  easiiy  reusabie,  high  quaiity,  and  save  time.  The  focus 
of  this  research  is  to  deveiop  software  that  is  abie  to  operate  in  many  eiectronic  devices  without 
negiecting  the  quaiity  of  the  software  itseif. 

The  probiems  that  arise  in  the  use  of  e-iearning  software  is  a  muiti-piatform  software 
deveiopment  requires  huge  resources  that  are  not  effective  and  efficient.  The  computer  program 
created  by  the  environment  of  eiectronic  devices  where  the  program  operates.  Each  of  these 
eiectronic  devices  have  different  operating  systems.  Characteristics  of  computer  programs  that 
operate  on  the  computer  in  the  form  of  different  web  appiications  with  computer  programs  in  the 
form  of  mobiie. 
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One  programming  paradigm  that  is  abie  to  adapt  to  the  amount  of  user  needs  is  a 
software  deveiopment  component-based.  The  software  components  is  a  new  paradigm  in 
programming  and  software  deveiopment.  The  principie  of  this  paradigm  is  moduiarisation 
computer  program  codes  which  form  a  speciai  specification  which  iater  caiied  the  component. 
Furthermore,  these  components  are  assembied  into  software  that  requires  specification  of  the 
component.  Characteristic  of  a  component  is  having  interface  which  wiii  be  used  as  a  medium 
of  communication  between  components.  [8]  gives  two  definitions  of  software  componenets  as 
foiiows:a.  The  software  components  are  binary  units  are  made  independentiy,  acquisition,  and 
distributed  in  a  iot  of  software  to  fuifiii  the  functionai  software. b.  A  software  component  is  a  unit 
of  composition  with  the  specifications  fixed  and  made  no  dependent  each  other.  A  software 
component  can  be  created  independentiy  created  by  a  third  party. 

The  roie  of  research  in  the  fieid  of  computer  science  even  more  contribute  to  the  e- 
iearning  systems  such  as  the  deveiopment  of  machine  iearning  (machine  iearning)  based 
iearning  case  (Case  Base  Learning),  iearning  systems  inteiiigent  (Inteiiigent  Tutoring  System) 
[6],  and  mobiie  iearning  [7].  Research  on  the  Reievance  of  Computer  Based  Computer 
Vocationai  Skiiis  SMK  and  Industry  Students  [9]  and  Strategy  of  Learning  and  Mechanicai 
Taient  on  CNC  Machine  Skiiis  [10]  provide  information  on  the  fact  that  computer-based  iearning 
is  more  iearning  to  improve  inteiiectuai  skiiis  than  Physicai  skiiis.  In  addition,  computer-based 
iearning  can  be  impiemented  with  e-iearning  iearning  modei  to  save  the  procurement  of 
computer-based  production  equipment  in  educationai  institutions.  [11]  study  on  the  evaiuation  of 
ICT-based  iearning  in  SMA  and  [12]  study  on  the  effectiveness  of  iearning  with  the  heip  of 
internet  in  SMK  in  generai  resuited  in  the  fact  that  community  awareness  of  the  use  of  e- 
iearning  for  improving  iearning  is  good,  quaiifications  of  educators.  And  the  attitude  of  students 
is  very  infiuentiai  on  the  success  of  e-iearning.  Based  on  these  conditions  and  information,  a 
study  of  e-iearning  iearning  modei  in  iine  with  the  advancement  of  information  technoiogy  where 
e-iearning  iearning  is  made  with  the  deveiopment  of  software  based  component  that  capabie  of 
operating  in  various  eiectronic  devices  that  have  its  own  piatform  of  web  and  mobiie. 


2.  Research  Method 

Descriptive  anaiysis  is  used  to  describe  data  in  the  quantitative  form  by  not  inciuding 
decision  making  through  hypothesis.  Data  are  presented  in  descriptive  form  without  being 
treated  with  other  static  anaiysis  techniques.  Descriptive  anaiysis  is  used  to  caicuiate  the 
minimum,  maximum,  mean,  standard  deviation,  and  totai  [13].  For  this  reason  descriptive 
anaiysis  is  used  in  this  study.  Descriptive  anaiysis  in  this  study  oniy  to  find  out  how  the 
knowiedge  of  students  and  teachers  about  the  internet,  e-iearning,  the  frequency  of  Internet 
use,  and  support  facilities  for  e-learning. 

Implementation  of  this  method  by  observation,  questionnaires  and  interviews  in  high 
school  6  in  Palembang.  Researchers  go  directly  to  the  school  to  conduct  observations  and 
interviews  with  teachers,  students,  and  school  leaders  about  how  they  utilize  existing 
information  technology  in  the  teaching  and  learning  process.  Implementation  of  this  method  by 
observation,  questionnaires  and  interviews  in  high  school  Number  6  in  Palembang. 
Researchers  go  directly  to  the  school  to  conduct  observations  and  interviews  with  teachers, 
students,  and  school  leaders  about  how  they  utilize  existing  information  technology  in  the 
teaching  and  learning  process. 

2.1.  Functional  and  Non-Functional  Requirements 

The  results  of  needs  analysis  can  we  conclude,  that  teacher  and  student  want  web 
application  e-learning  FUOLC  be  simple  and  easy  to  use.  As  for  functionality  that  FUOLC  have 
as  follows  : 

2.1.1.  Functionality  Needs 

Functionality  needs  from  system  to  be  built  as  follows: 

a.  System  can  do  Authentification  process,  that  is  security  process  that  will  be  validate  users 
when  they  want  to  entering  the  system  with  checking  to  their  list  that  granted  to  entering 
the  system. 

b.  System  can  process  subject’s  data,  either  it  adding,  changing,  or  removing  subject’s  data 
in  system. 
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c.  System  can  process  teacher’s  data,  either  it  adding,  changing,  or  removing  teacher’s  data 
in  system. 

d.  System  can  process  student’s  data,  either  it  adding,  changing,  or  removing  student’s  data 
in  system. 

e.  System  can  process  ciass’s  data,  either  it  adding,  changing,  or  removing  ciass’s  data  in 
system. 

f.  System  can  on-iine  24  hours  through  internet  network. 

g.  Data  searching  process  can  be  done  ±  1  second  in  one  searching. 

2.1.2.  FUOLC’s  Business  Procedure  and  Process 

The  software  that  wiii  be  deveioped  given  FUOLC  code.  Generaiiy  business  process 
using  FUOLC  divided  into  five  (5)  categories  as  foiiows: 

a.  Teacher  and  student  registration 

A  teacher  and  student  to  be  abie  to  use  FUOLC  faciiities  have  must  register  themseives 
to  FUOLC  first.  How  to  register  for  teacher  can  be  done  with  caiiing  FUOLC’s  administrator  via 
e-mail.  The  administrator  wiii  make  a  iesson  content  based  upon  the  teacher’s  request.  Student 
registration  can  be  done  with  fiiiing  the  registration  form  in  FUOLC’s  front  page.  After  the 
registration,  student  can  iogin  to  the  FUOLC.  In  student’s  page,  there  are  registration  subjects 
form.  Student  can  foiiow  the  subjects  as  a  subjects  participant  after  fiiiing  registration  subjects 
participant  form. 

b.  Authentication  and  Authorization 

A  user  wiii  iogin  first  before  get  in  to  the  FUOLC  with  entering  NIP,  NIS,  password  and 
user’s  level.  FUOLC  will  do  the  authentication  and  authorization  each  user  who  logged  in.  The 
authentication  and  authorization  results  will  be  known  the  access  rights  for  each  user. 

c.  FUOLC’s  Data  Management 

Data  management  process  done  by  administrator.  The  form  of  management  data  can 
be  adding,  removing,  changing,  and  displays  data  of  study  program,  teacher,  student,  subject, 
and  news.  Just  for  data  management  of  subjects  are  implementation  from  lesson  content. 
Subjects  added  to  FUOLC  because  of  teacher’s  request. 

d.  Distribution  of  Material  Lesson 

Distribution  process  material  lesson  can  be  done  with  2  ways.  The  first  way  can  be 
done  with  write  down  directly  material  lesson  in  material  lesson’s  form  page.  The  second  way, 
teacher  can  up-load  material  lesson’s  file.  Maximum  size  up-loaded  file  are  SMB.  Rationing  of 
material  lesson  based  on  subjects  used  by  the  teacher.  Student  can  download  material  lesson 
file,  material  lesson  form  in  lesson  content  that  followed  by  the  student. 

e.  Tasks  Collecting 

Teacher  can  give  tasks  to  student  through  the  lesson  announcement  form.  Student  can 
collect  tasks  through  the  FUOLC  student  tasks  form.  Maximum  size  up-loaded  file  are  5MB. 
Files  student  tasks  can  be  downloaded  by  the  teacher  in  student  tasks  list  according  to  the 
tasks  content  categories. 

f.  Lesson  Information’s  Media 

Administrator  and  teacher  can  give  information  related  with  the  using  of  FUOLC. 
Administrator  can  give  new  that  related  to  the  academic  activity  in  SMA  N  6.  Teacher  can  give 
announcements  such  as  lessons  cancellations  or  additions,  giving  and  collecting  tasks,  or  there 
are  material  lesson  that  just  uploaded. 


3.  Results  and  Analysis 

Developed  e-learning’s  software  based  on  multiplatform  component  given  FUOLC  code. 
Results  obtained  from  the  developed  e-learning’s  software  cycle  using  spiral  mode.  Table  1 
show  student’s  statistic  deskriptif. 


Table  1.  Student’s  Statistic  Deskriptif 


N 

Minimum 

Maximum 

Mean 

Std.  deviasi 

Pemahaman 

165 

22.00 

47.00 

33.8727 

5.41921 

Pengetahuan 

165 

22.00 

40.00 

33.2545 

3.88345 

Valid  N  (listwise) 

165 
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From  the  results  of  questionnaires  given  to  students  of  SMAN  6  and  SMAN  10  (165 
sampies)  it  appears  that  few  students  have  iaptops,  rareiy  use  the  internet,  and  do  not  know  e- 
iearning.From  the  resuits  of  data  processing  seen  oniy  33.87%  of  students  who  have  an 
understanding  of  the  internet,  and  33.25%  who  have  knowiedge  about  the  internet.  Tabie  2. 
show  teacher’s  statistic  deskriptif. 


Tabie  2.  Teacher’s  Statistic  Deskriptif 


N 

Minimum 

Maximum 

Mean 

Std.  deviasi 

Pemahaman 

37 

11.00 

40.00 

29.2162 

6.64637 

Pengetahuan 

37 

29.00 

40.00 

33.7568 

3.13054 

Vaiid  N  (listwise) 

37 

From  the  resuits  of  the  questionnaires  given  to  teachers  of  SMAN  6  and  SMAN  10  (37 
sampies)  it  appears  that  few  teachers  have  iaptops,  rareiy  use  the  internet,  do  not  know  what  e- 
iearning  is,  and  stiii  do  the  teaching-iearning  process  conventionaiiy.  From  the  resuits  of  data 
processing  seen  oniy  29.21%  of  teachers  who  understand  the  internet,  and  33.75%  who  have 
knowiedge  about  the  internet. 

3.1.  Use  Case  Diagram  of  E-Learning’s  Software 

Use  case  diagram  in  Figure  1  shows  interaction  between  actor  and  e-iearning’s 
software.  There  are  3  factors  interact  with  FUOLC,  which  are  Administrator  that  have  the 
responsibiiity  with  aii  the  system,  teacher  and  student  as  FUOLC  main  users,  and  visitors  who 
have  rights  just  to  see  the  front  page  of  FUOLC.  Forms  of  interaction  between  actor  and  FUOLC 
are  impiementations  of  functionaiity  needs  from  teacher  and  student. 


Figure  1 .  Use  case  diagram 
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Figure  2.  FUOLC’s  component  diagram 


3.2.  E-learning’  Software  Architecture 

FUOLC  architecture  consists  of  2  main  eiements  where  is  show  in  Figure  3,  which  is 
EJB  eiement  and  web  eiement.  In  EJB  element,  there  are  entity  package  consisting  of  entity 
component  owned  by  FUOLC.  Entity  component  program  decrypting  specification  of  FUOLC 
entities.  Second  package  that  owned  by  EJB  element  is  model  package  containing  component 
that  connected  to  the  database.  Each  data  that  needed,  FUOLC  will  activate  components 
model.  The  second  main  element  that  owned  by  FUOLC  are  web  element.  In  this  element,  there 
are  2  package  that  is  controller  package  which  have  function  to  arrange  data  flow  in  FUOLC 
and  web  package  that  contain  FUOLC’s  interface  components.  Figure  3  explain  FUOLC’s 
component  diagram 


Mobile  Deuce 


Figure  3.  FUOLC’s  Architecture 


FUOLC  e-learning’s  software  can  accessed  by  various  electronic  devices  such  as 
computer  and  mobile  devices  (tablet  and  smartphone).  When  FUOLC  accessed  by  the 
computer,  the  FUOLC’s  interface  display  will  adjust  with  the  mobile  device  screen.  FUOLC’s 
interface  adjusting  won’t  make  FUOLC’s  interface  layout  become  uncomfortable  used  by  the 
teacher  and  student. 

Data  flow  and  actions  in  FUOLC  will  be  arranged  by  the  components  controller.  If  the 
data  needed  it  is  in  database,  the  component  controller  will  contact  the  component  model.  Then 
component  model  will  send  the  data  to  the  component  controller. 

Last,  interface  component  will  display  data  in  FUOLC  interface,  according  to  the  teacher 
and  student’s  needs. 

E-learning’s  software  based  on  FUOLC  component  testing  done  by  the  reusability  and 
maintainability  quality  factor.  Table  3  show  detail  e-learning’s  software  test  results  based  on 
fuolc’s  multiplatform  component  using  maintainability  and  reusability  quality  factor.  Flow  to  tests 
done  with  checking  FUOLC  computer’s  program  codes  based  on  sub-factors  measurement  of 
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both  factors  quality.  Figure  4  show  detail  piece  of  code  FUOLC’s  entity  component.  Based  on 
McCall’s  model,  maintainability  quality  factor  have  6  sub-factor  qualities  that  can  be  used  to 
know  that  quality  factor,  that  is:  simplicity,  modularity,  coding  and  documentation,  self 
descriptiveness,  consistency,  and  document  accessibility.  Sub-factor  that  owned  by  the 
reusability  quality  factor  there  are  seven  sub-factor,  that  is:  modularity,  document  accessibility, 
software  system  independence,  self  descriptive,  generality,  and  simplicity.  Based  on  testing  that 
have  done  with  FUOLC  using  second  sub-factor  of  quality  factor,  we  can  get  a  results  that 
FUOLC  fulfill  all  of  the  reusability  and  maintainability  sub-factors.  Figure  5  show  Analysis  results 
done  to  FUOLC  can  resolve  needs  changing  or  teacher  and  student  that  is  large  and  variative. 


Table  3.  E-learning’s  Software  Test  Results  Based  on  FUOLC’s  Multiplatform  Component  Using 
_ Maintainability  and  Reusability  Quality  Factor 


Quality  Factor 

Sub-Factor  Quality 

FUQLC 

Simplicity 

* 

Modularity 

* 

Coding  and 

* 

.c 

Documentation 

■2 

.c 

Consistency 

* 

Document 

Accessibility 

* 

Self  Descriptiveness 

* 

Modularity 

* 

Document 

* 

Accessibility 

Software  System 

* 

Ct3 

Independence 

:3 

Application 

* 

a; 

Independence 

Self  Descriptive 

* 

Generality 

* 

Simplicity 

* 

*)Fulfilled 

Window  Flelp 

a  0  -B-®  ■ 


Search  (Ctrl +1) 


^  Gurcfa(3de.}ava  lt|j3|  Abstracifacade.iava  >||J^  addGunj.xhtmi  GunjControler.java  M |  ^  Guu.java  ll|J^  KetasFacacte.java 


Hstory  I  I 


:nip") , 


*  fiaathor  User 
QEntity 

@Table (name  «  "guru") 

@XmlRootElemenc 
@NamedQuerie3 ( { 

QNamedQuery (name  =  "Guru. f indAll",  tjuery  =  "SELECT  g  FRCM4  Guru  g"), 

SNamedOuery (name  =  "Guru.finciByNip",  guery  =  "SELECT  g  FR^  Guru  g  WHERE  g.ntlp 
QNamedQuery (name  =  "Guru. f indByNamaDepan",  cjuery  =  "SELECT  g  FROM  Guru  g  WHEM  g.namaDepan  “  rnamaDe 
SNamedOuery (name  =  "Guru ♦ f indByNamaBela^ang" ,  query  =  "SELECT  g  FROM  Guru  g  WHERE  g.namaBelakang  =  : 

"Guru. f indByTempacLahir",  cjuery  *=  "SELECT  g  FROM  Guru  g  WHERE  g. tempacLahir  •  :te 
"Guru. findByTanggalLahir",  query  =  "SELECT  g  FRW  Guru  g  WHERE  g.tanggalLahir  =  : 
"Guru. f indByJenisKelamin",  query  =  "SELECT  g  FROM  Guru  g  WHERE  g. jenrsKelamrn  “  : 
"Guru.findByNoHP",  query  =  "SELECT  g  FRCW  Guru  g  WHERE  g.RoHP  =  :noKP"), 
"Guru.findByEmail",  query  ■  "SELECT  g  FR(»f  Guru  g  WHERE  g^. email  «  remail")}) 
public  class  Guru  m^jlemencs  Serializable  { 

private  static  final  long  seTxalVezsionVlD  =  IL; 

@Id 

SBasic (optional  =  false) 

SNotNull 

@Size(min  =  1,  max  =  10) 

QColcimn  (name  =  "Nip") 
private  String  nip; 

SSize (max  >  20) 

SColumn (name  =  "Nama Depan") 
private  String  namaDepan; 

@Size(max  =  20) 

SColumn  (name  =  "NamaBelaleang") 


SNamedOuery (name  = 
SNamedOuery (name  ^ 
SNamedOuery (name  ' 
SNamedOuery (name  ^ 
SNamedOuery (name  • 


l>  — 

111  INS 

la 

*  e  . . .  29/S^15 

Figure  4.  Piece  of  code  FUOLC’s  entity  component 
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Figure  5.  Android  view 


4.  Conclusion 

The  deveiopment  of  software  based  component  is  a  form  of  modern  software 
deveiopment  capabie  of  producing  a  software  that  is  easy  to  re-use,  high  quaiity,  and  time¬ 
saving.  The  fiexibiiity  of  e-iearning  software  capabie  of  operating  in  many  eiectronic  devices 
(muiti  piatform)  requires  a  form  of  software  architecture  that  enabies  e-iearning  software 
deveiopers.  FUOLC’s  e-iearning  software  based  on  muitipiatform  component  have  a  program 
structure  that  simpie  and  easy  to  understand.  Components  that  have  been  made  and 
assembied  with  the  other  have  form  an  integrated  unity.  FUOLC’s  e-iearning  software  can  adapt 
with  many  eiectronic  devices  who  have  their  own  piatform  when  access  it.  This  adaptation  won’t 
affect  the  data  and  the  comfort  of  software  using.  Based  on  the  test  resuits,  FUOLC’s  e-iearning 
software  have  reusabiiity  and  maintainabiiity  quaiities.  Reusabiiity  is  an  abiiity  from  component 
to  re-used  when  there  is  same  specification  from  e-iearning  web  appiication.  E-iearning’s  web 
appiication  being  efficient  because  program  code  no  need  to  be  written  over  and  over. 
Maintainabiiity  is  an  ease  owned  by  component  to  repairs  if  error  found.  Both  of  this  quaiity 
factors  heips  deveiopment  this  FUOLC’s  e-iearning  software  to  anticipate  the  teacher  and 
student  need  that  changes  which  is  big  and  variative. 
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